<template>
  <div>
    <el-form :model="form" ref="ruleForm" label-width="100px" size="small">
      <el-form-item label="已操作月份:" >
        <span v-if="!allData.length">暂无已操作月份</span>
        <el-radio-group v-if="allData.length" v-model="date">
          <el-radio-button v-for="item in allData" :key="item.month" :label="item.month"></el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="批量操作:" v-if="type!='look'">
        <el-button size="small" @click="checkAll">全月</el-button>
        <el-button size="small" @click="checkOneToFive">周一至周五</el-button>
        <el-button size="small" @click="checkWeekend">周六日</el-button>
        <el-button type="primary" size="small" @click="reset">恢复选择</el-button>
      </el-form-item>
    </el-form>
    <div class="flex">
      <div>
        <rili :disabled="type=='look'" v-model="date" ref="rili"></rili>
      </div>
      <div class="flex">
        <div class="pircecon" v-if="type!='look'">
          <div class="t">修改选中的日期</div>
          <div class="mbody">
            <div class="hang">
              <div class="td">成人价</div>
              <div class="td">
                <el-input class="w100" size="small" v-model="priceObj.price" placeholder="请输入内容"></el-input>
              </div>
            </div>
            <div class="hang">
              <div class="td">儿童价</div>
              <div class="td">
                <el-input class="w100" size="small" v-model="priceObj.child_price" placeholder="请输入内容"></el-input>
              </div>
            </div>
            <div class="hang">
              <div class="td">单房差价</div>
              <div class="td">
                <el-input class="w100" size="small" v-model="priceObj.diff_price" placeholder="请输入内容"></el-input>
              </div>
            </div>
            <div class="hang">
              <div class="td">数量</div>
              <div class="td">
                <el-input class="w100" size="small" v-model="priceObj.stock" placeholder="请输入内容"></el-input>
              </div>
            </div>
            <div class="foot">
              <el-button size="small" @click="clear">清空</el-button>
              <el-button type="primary" size="small" @click="save">保存</el-button>
            </div>
          </div>
        </div>

        <div class="pircecon" v-if="!nocost">
          <div class="t">参考成本</div>
          <div class="mbody">
            <div class="hang">
              <div class="td">成人价成本</div>
              <div class="td">
                {{chengbenObj.costCr}}
              </div>
            </div>
            <div class="hang">
              <div class="td">儿童价成本</div>
              <div class="td">
                {{chengbenObj.costEt}}
              </div>
            </div>
            <div class="hang">
              <div class="td">住宿成本</div>
              <div class="td">
                {{chengbenObj.costZS}}
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import rili from 'components/workComponents/rili'
import dateFormat from 'common/js/date'
import {deepClone} from 'common/js/util';

export default {
  components: {
    rili
  },
  props: {
    type: {},
    nocost: {
      default: false
    }
  },
  data() {
    return {
      date: dateFormat(new Date(), 'yyyy-MM'),
      // selectMonth: '2020-03',
      radio1: '',
      allData: [],
      form: {
      },
      chengbenObj: {
        costCr: 0,
        costEt: 0,
        costZS: 0
      },
      priceObj: {
        price: '',
        child_price: '',
        diff_price: '',
        stock: ''
      },
      content: '',
      input: ''
    };
  },
  watch: {
    date(val) {
      console.log('设置了日期啊', val)
      this.dateChangeSetData(val)
    }
  },
  methods: {
    setChengben(val) {
      this.chengbenObj = {...val}
    },
    // 对日历设置数据
    dateChangeSetData(val) {
      let item = this.allData.find(item => item.month === val)
      this.$refs.rili.initView(val)
      if(item) {
        this.$refs.rili.setData(item.month_detail)
      }
    },
    clear() {
      this.$refs.rili.clearTicketData()
    },
    save() {
      let flag = this.$refs.rili.setTicketData(this.priceObj)
      if(!flag) return
      let obj = this.$refs.rili.getData()
      console.log('保存的数据', this.allData)
      let index = this.allData.findIndex(item => item.month === obj.month)
      console.log(index)
      if(index > -1){
        let old = [...this.allData]
        old[index] = obj
        this.allData = old
      }else{
        this.allData.push(obj)
      }
    },
    checkAll() {
      this.$refs.rili.checkAll()
    },
    checkOneToFive() {
      this.$refs.rili.checkOneToFive()
    },
    checkWeekend() {
      this.$refs.rili.checkWeekend()
    },
    reset() {
      this.$refs.rili.reset()
    },
    async setData(value) {
      let obj = deepClone(value.repertoryArr)
      // 组成一个alldata  放在这里
      let newObj = []
      obj.forEach(item => {
        let objitem = {month: item.month}
        if(item.ci_id) {
          objitem.ci_id =item.ci_id
        }
        let arr = this.$refs.rili.createDataByDate(item.month)
        let hasDataDay = []
        item.month_detail.forEach(subitem => {
          let datearr = subitem.day.split('-')
          let day = datearr[2]*1
          hasDataDay.push(day)
        })
        arr.forEach(mitem => {
          if(hasDataDay.indexOf(mitem.value) > -1) {
            let findItem = item.month_detail.find(item2 => {
              let datearr2 = item2.day.split('-')
              let day2 = datearr2[2]*1
              return day2 == mitem.value
            })
            mitem.repertory_id = findItem.repertory_id
            mitem.storeInfo = findItem
          }
        })
        objitem.month_detail = arr
        newObj.push(objitem)
      })
      this.allData = newObj
      if(this.allData.length) {
        this.date = this.allData[0].month
        this.dateChangeSetData(this.date)
      }
    },
    async getData() {
      let obj = {}
      obj.repertoryArr = this.allData.map(item => {
        let myitem = {}
        myitem.month = item.month
        if(item.ci_id){
           myitem.ci_id = item.ci_id
        }
        let month_detail = []
        item.month_detail.forEach(subItem => {
          if(subItem.storeInfo){
            subItem.storeInfo.day =  item.month +'-'+ ('0'+subItem.value).slice(-2)
            if(subItem.repertory_id != -1) {
              subItem.storeInfo.repertory_id = subItem.repertory_id
            }
            month_detail.push(subItem.storeInfo)
          }
        })
        myitem.month_detail = month_detail
        return myitem
      })
      console.log(obj)
      return obj
    }
  },
  mounted() {
  }
};
</script>

<style lang="scss" scoped>
.pircecon{
  margin-left: 20px;
  .mbody{
    border-left: 1px solid #eee;
    border-top: 1px solid #eee;
  }
  .t{
    text-align: center;
    line-height: 30px;
  }
  .hang{
    display: flex;
    &>:nth-child(1){
      width: 100px;
    }
    &>:nth-child(2){
      min-width: 100px;
    }
  }
  .w100{
    width: 100px;
  }
  .td{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 10px;
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
  }
  .foot{
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    padding: 10px;
    display: flex;
    justify-content: flex-end;
  }
}
</style>
